<!DOCTYPE html>
<html>

<link rel="stylesheet" type="text/css" href="../CssFrame/bootstrap-theme.css">
<link rel="stylesheet" type="text/css" href="../CssFrame/bootstrap.css">

<script src="../Jquery/Jquery-3.3.1.js" type="text/javascript"></script>
<!-- 曲奇包要在min包之后 -->
<script src="../Jquery/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>

<head>
<meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />
<title>修改头像</title>

</head>

<body>
	<div class="col-md-12 top-nav" style="text-align: center; font-size: 18px; margin-top: 45px;">
		<div class="col-md-6">
			<p>选择本地照片，上传编辑自己的头像</p>
			<br>
			<div>
				<form enctype=“multipart/form-data” id="avatarForm" class="form-horizontal" role="form">
					<!--  -->
					<span>原旧肖像:<img src="" id="portrait00"></span> <br> <br>
					<!--  -->
					<input type="file" name="portrait" id="portrait" style="margin-left: 330px;"> <br> <br>
					<!--  -->
					<span style="font-size: 12px; color: #9b1097;">支持jpg、jpeg、gif、png、bmp格式的图片</span> <br> <br>
					<!--  -->
					<input type="button" value="确定上传" id="itsOk">
				</form>
			</div>
			<!--  -->
			<br> <br>
			<!--  -->
			<a href="ShowOwnProfile.html">返回个人资料</a>
		</div>
	</div>
</body>
<!--  -->
<script type="text/javascript">
	$(document).ready(function() {
		exhibitAvatar();
	});

	/***********************************/
	$("#itsOk").on("click", function() {
		var url = "/dormitory/HouseParents/uploadAvatarHandler";

		var portrait = new FormData($("#avatarForm")[0]);
		console.log(portrait);

		$.ajax({
			"contentType" : false,
			"processData" : false,

			'url' : url,
			'type' : 'POST',
			'data' : portrait,
			'dataType' : 'json',

			'success' : function(r) {
				if (r.state === 200) {
					alert('修改成功');

					/*存入曲奇中*/
					$.cookie('portrait', r.data, {
						expre : 3
					});

					location.href = 'ShowOwnProfile.html';
				} else {
					alert(r.message);
				}
				/*  */
			},

			/*******/
			"error" : function() {
				alert("您的登录信息已经过期,请重新登录");
				location.href = "Login.html";
			}

		/*  */
		});
		/*  */
	});
	/* ***************************** */
	/* ----------------------------- */
	/* ***************************** */
	function exhibitAvatar() {
		var url = '/dormitory/HouseParents/exhibitProfile';

		$.ajax({
			"url" : url,
			"dataType" : "json",
			"type" : 'GET',
			"success" : function(r) {
				/*  */
				if (r.state === 200) {
					/* */
					if (r.data.portrait != null && r.data.portrait !== '') {
						$('#portrait00').attr('src', "http://localhost:8080/dormitory" + r.data.portrait)
					}

				} else {
					alert(r.message);
				}
				/*  */
			}
		/*  */
		});
	}
</script>
</html>